<template>
  <div class="app-container">
	  <el-form :model="formData" ref="formData" :rules="rules" label-width="90px">
	  <el-row>
	      <el-col :span="12">
	        <el-form-item label="类别:" prop="cate_id">
	          <el-select v-model="formData.cate_id" value="">
	            <el-option v-for="(item,index) in leftData" :label="item.cate_name" :value="item.unid"></el-option>
	          </el-select>
	        </el-form-item>
	      </el-col>
	      <el-col :span="12">
	        <el-form-item label="项目名称:" prop="item_name">
			  <el-input v-model="formData.item_name"></el-input>
	        </el-form-item>
	      </el-col>
	      <el-col :span="12">
	        <el-form-item label="编码:" prop="card_num">
	          <el-input v-model="formData.card_num"></el-input>
	        </el-form-item>
	      </el-col>
	      <el-col :span="12">
	        <el-form-item label="规格:" prop="specification">
	          <el-input v-model="formData.specification"></el-input>
	        </el-form-item>
	      </el-col>
	      <el-col :span="12">
	        <el-form-item label="单位:" prop="units">
	          <el-input v-model="formData.units"></el-input>
	        </el-form-item>
	      </el-col>
	      <el-col :span="12">
	        <el-form-item label="销售单价:" prop="price" label-width="90px">
	          <el-input v-model="formData.price"></el-input>
	        </el-form-item>
	      </el-col>
	      <el-col :span="24">
	        <el-form-item label="状态:" prop="status">
	          <el-radio-group v-model="formData.status">
	            <el-radio :label="1" value="1">启用</el-radio>
	            <el-radio :label="2" value="2">停用</el-radio>
	          </el-radio-group>
	          <el-checkbox v-model="formData.is_return" style="font-weight: bold;margin-left: 30px" :true-label="1" :false-label="0">是否允许退费</el-checkbox>
	        </el-form-item>
	      </el-col>
	      <el-col :span="12">
	        <el-form-item label="适用课程:" label-width="90px" prop="lession_id">
	          <el-select v-model="formData.lession_id">
	            <el-option v-for="(item,index) in lessionList" :label="item.lession_name" :value="item.unid"></el-option>
	          </el-select>
	        </el-form-item>
	      </el-col>
		  <el-col :span="12">
		    <el-form-item label="选用教材:" label-width="90px" prop="textbook_id">
		      <el-select v-model="formData.textbook_id">
		        <el-option v-for="(item,index) in teaList" :label="item.textbook_name" :value="item.unid"></el-option>
		      </el-select>
		    </el-form-item>
		  </el-col>
	      <el-col :span="24">
	        <el-form-item label="备注:">
	          <el-input v-model="formData.desc"></el-input>
	        </el-form-item>
	      </el-col>
	    </el-row>
	  </el-form>
	  <el-button :type="btn == '添加'?'primary':'success'" @click="addPayItem('formData')">{{btn}}</el-button>
  </div>
</template>

<script>
  import { addPayItem } from '@/api/studentRecruit.js'
  export default {
    name: 'index2',
    data() {
      return {
		formData:{
		  unid:null,
          item_name:null, //项目名称
          cate_id:null, //类别id
          card_num:null, //编码
          textbook_id:null, //教材id
          lession_id:null, //课程id
          status:null, //状态 1启用 2不启用
          is_return:0, //是否允许退费 1 允许 0 不允许
          specification:null, //规格
          units:null, //单位
          price:null, //单价
          desc:null, //备注
        },
		rules: {
          cate_id: [
            { required: true, message: '请选择类别', trigger: 'blur,change' }
          ],
          item_name: [
            { required: true, message: '请选择名称', trigger: 'blur,change' }
          ],
          card_num: [
            { required: true, message: '请输入编码', trigger: 'blur,change' }
          ],
          specification: [
            { required: true, message: '请输入规格', trigger: 'blur,change' }
          ],
          units: [
            { required: true, message: '请输入单位', trigger: 'blur,change' }
          ],
          price: [
            { required: true, message: '请输入销售单价', trigger: 'blur,change' }
          ],
          status: [
            { required: true, message: '请选择状态', trigger: 'blur,change' }
          ],
          lession_id: [
            { required: true, message: '请选择课程', trigger: 'blur,change' }
          ],
		  textbook_id: [
		    { required: true, message: '请选择教材', trigger: 'blur,change' }
		  ]
        },
      }
    },
	created() {
	  
	},
    methods: {
	  //查看
	  queryData(){
		delete this.stuData.update_time
		delete this.stuData.createor_name
		delete this.stuData.createor_id
		delete this.stuData.create_time
		delete this.stuData.institution_id
		this.formData = this.stuData
		console.log(this.formData);
	  },
      //添加信息
            addPayItem(formData){
              this.$refs[formData].validate((valid) => {
                if (valid) {
                  addPayItem(this.formData).then(resData => {
                    if (resData.code == 200){
                      this.$message.success('添加成功！')
                      Object.keys(this.formData).forEach(key => {
						  if(key == 'is_return'){
							this.formData[key] = 0  
						  }
                        this.formData[key] = ''
                      })
					  this.queryType()
                    }else {
                      this.$message.error('添加失败！')
                    }
                  })
                }else {
                  return false;
                }
              });
            }
    },
	props:{
		leftData:{
			type:Array,
			default:[],
		},
		lessionList:{
			type:Array,
			default:[],
		},
		teaList:{	
			type:Array,
			default:[],
		},
		stuData:{
			type:Object,
			default:() => {},
		},
		queryType:{
			type:Function,
			default:() => {},
		},
		btn:{
			type:String,
			default:'',
		}
	}
  }
</script>

<style lang="scss" scoped>

</style>
